<template>
    <div class="dashboard-container">
        <div>
            <my-search :fields="fieldsList" :baseNumber="12" @onSearch="searchForm" @onReset="resetForm" :selectIsAddAll="false"></my-search>
            <div class="btn">
                <el-button type="primary" size="mini" @click="exportDataHandle">导出</el-button>
            </div>
            <div class="table-list">
                <el-table ref="singleTable" border stripe :data="tableDatas" style="width: 100%;table-layout: fixed;" empty-text="暂无数据" tooltip-effect="light" :height="$store.state.app.windowHeight - 245">
                    <el-table-column :resizable="false" type="index" label="序号" width="60" align="center" :index="currIndex"> </el-table-column>
                    <template v-for="column in tableColumns">
                        <el-table-column :key="column.prop+Math.random()" :prop="column.prop" show-overflow-tooltip :width="column.width" :min-width="column.minWidth" :fixed="column.fixed" :resizable="!column.fixed" align="center" :label="column.label" :sortable="column.sortable">
                            <template slot-scope="scope">
                                <span>
                                    <span v-if="column.render" class="underline-text" @click="go(scope.row)">
                                        {{ scope.row[column.prop] }}
                                    </span>
                                    <span v-else>{{column.render}}{{ scope.row[column.prop] }}</span>
                                </span>
                            </template>
                            <template v-if="column.children">
                                <el-table-column v-for="(columnChildren, index) in column.children" :key="index" :prop="columnChildren.prop" show-overflow-tooltip :width="columnChildren.width" :min-width="columnChildren.minWidth" :fixed="columnChildren.fixed" :resizable="!column.fixed" align="center" :label="columnChildren.label" :sortable="columnChildren.sortable">
                                    <template slot-scope="scope">
                                        <span>
                                            <span>{{ scope.row[columnChildren.prop] }}</span>
                                        </span>
                                    </template>
                                    <template v-if="columnChildren.children">
                                        <el-table-column v-for="(columnChildren1, index1) in columnChildren.children" :key="index1" :prop="columnChildren1.prop" show-overflow-tooltip :width="columnChildren1.width" :min-width="columnChildren1.minWidth" :fixed="columnChildren1.fixed" :resizable="!column.fixed" align="center" :label="columnChildren1.label" :sortable="columnChildren1.sortable">
                                            <template slot-scope="scope">
                                                <span>
                                                    <span>{{ scope.row[columnChildren1.prop] }}</span>
                                                </span>
                                            </template>

                                            <template v-if="columnChildren1.children">
                                                <el-table-column v-for="(columnChildren2, index2) in columnChildren1.children" :key="index2" :prop="columnChildren2.prop" show-overflow-tooltip :width="columnChildren2.width" :min-width="columnChildren2.minWidth" :fixed="columnChildren2.fixed" :resizable="!column.fixed" align="center" :label="columnChildren2.label" :sortable="columnChildren2.sortable">
                                                    <template slot-scope="scope">
                                                        <span>
                                                            <span>{{ scope.row[columnChildren2.prop] }}</span>
                                                        </span>
                                                    </template>
                                                </el-table-column>
                                            </template>
                                        </el-table-column>
                                    </template>
                                </el-table-column>
                            </template>
                        </el-table-column>
                    </template>
                </el-table>

                <el-pagination background style="text-align: right;" :current-page="queryObj.pageNo" :page-size="queryObj.pageSize" :total="total" :pager-count="7" layout="total, sizes, prev, pager, next, jumper" @current-change="changepageNo" @size-change="changePageSize"></el-pagination>
            </div>
        </div>

    </div>
</template>

<script>

import { queryQycwzbfx, exportData } from '@/api/cxtj/qycwbbfx'
import { hylx } from '@/api/common'
import { downloadFile } from "@/utils/utils"
export default {
    name: 'zdsygl-list',

    data() {
        return {
            loading: false,
            tjloading: false,
            showTable: false,
            fieldsList: [
                {
                    label: '纳税人名称',
                    field: 'nsrmc',
                    type: 'text',
                    value: ''
                },
                {
                    label: '纳税人识别号',
                    field: 'nsrsbh',
                    type: 'text',
                    value: ''
                },


                {
                    label: '行业门类',
                    field: 'hyml_dm',
                    type: 'select',
                    value: '',
                    multiple: false,
                    options: [],
                    change: (value) => {
                        this.gethylx(3, "dm_gy_hy", "dlbz='Y' and sjhy_dm = '" + value + "'", "hy_dm")
                    }
                },
                {
                    label: '行业大类',
                    field: 'hydl_dm',
                    type: 'select',
                    value: '',
                    multiple: false,
                    options: [],
                    change: (value) => {
                        this.gethylx(4, "dm_gy_hy", "zlbz='Y' and sjhy_dm = '" + value + "'", "hy_dm")
                    }
                },
                {
                    label: '行业中类',
                    field: 'hyzl_dm',
                    type: 'select',
                    value: '',
                    multiple: false,
                    options: [],
                    change: (value) => {
                        this.gethylx(5, "dm_gy_hy", "xlbz='Y' and sjhy_dm = '" + value + "'", "hy_dm")
                    }
                },
                {
                    label: '行业小类',
                    field: 'hyxl_dm',
                    type: 'select',
                    value: '',
                    multiple: false,
                    options: [],

                },
                {
                    label: '指标项',
                    field: 'zbx',
                    type: 'select',
                    value: '',
                    multiple: false,
                    options: [{
                        label: '销售净利润',
                        value: '销售净利润'
                    }],

                },
                {
                    label: '年度范围',
                    field: 'nd',
                    type: 'yearrange', // daterange
                    value: [],
                    options: [
                        {
                            field: 'ksnd',
                            value: ''
                        },
                        {
                            field: 'jsnd',
                            value: ''
                        }
                    ],
                    change: value => {
                        // this.changxm(value);
                    }
                },

                {
                    label: '同比增长率',
                    field: 'tbzzl',
                    type: 'percentageRange',
                    value: [],
                    options: [
                        {
                            field: 'tbzzlks',
                            value: ''
                        },
                        {
                            field: 'tbzzljs',
                            value: ''
                        }
                    ],
                },


            ],
            tableColumns1: [],
            tableColumns: [
                {
                    label: '纳税人名称',
                    prop: 'nsrmc',
                    align: 'center',
                    width: 200,
                    render: '11'
                },
                {
                    label: '纳税人识别号',
                    prop: 'nsrsbh',
                    align: 'center',
                    width: 200
                },

                {
                    label: '行业门类',
                    prop: 'hymlmc',
                    align: 'center',
                    width: 200
                },
                {
                    label: '行业大类',
                    prop: 'hydlmc',
                    align: 'center',
                    minWidth: 180
                },
                {
                    label: '行业中类',
                    prop: 'hyzlmc',
                    align: 'center',
                    width: 200
                },
                {
                    label: '行业小类',
                    prop: 'hyxlmc',
                    align: 'center',
                    width: 200,

                },
                // {
                //     label: '销售',
                //     prop: '',
                //     align: 'center',
                //     width: 200,
                //     children: [
                //         {
                //             label: '2022',
                //             prop: '',
                //             align: 'center',
                //             children: [
                //                 {
                //                     label: '本期',
                //                     prop: 'jlr2022',
                //                     align: 'center',
                //                 },
                //                 {
                //                     label: '同比',
                //                     prop: 'tb2022',
                //                     align: 'center',
                //                 }
                //             ]
                //         },
                //         {
                //             label: '2023',
                //             prop: '',
                //             align: 'center',
                //             children: [
                //                 {
                //                     label: '本期',
                //                     prop: 'jlr2023',
                //                     align: 'center',
                //                 },
                //                 {
                //                     label: '同比',
                //                     prop: 'tb2023',
                //                     align: 'center',
                //                 }
                //             ]
                //         }, {
                //             label: '2024',
                //             prop: '',
                //             align: 'center',
                //             children: [
                //                 {
                //                     label: '本期',
                //                     prop: 'jlr2024',
                //                     align: 'center',
                //                 },
                //                 {
                //                     label: '同比',
                //                     prop: 'tb2024',
                //                     align: 'center',
                //                 }
                //             ]
                //         }
                //     ]
                // },





            ],

            tableDatas: [],

            queryObj: {
                nsrmc: '', //公司名称
                nsrsbh: '',
                hyml_dm: '',
                hydl_dm: '',
                hyzl_dm: '',
                hyxl_dm: '',
                zbx: '',
                ksnd: '',
                jsnd: '',
                tbzzlks: '',
                tbzzljs: '',
                pageNo: 1,
                pageSize: 20
            },
            total: 0,

        }
    },

    mounted() {
        this.gethylx(2, 'dm_gy_hy', "mlbz = 'Y'", "hy_dm")  //获取行业门类

        // this.getTableData();
    },
    methods: {

        searchForm(params) {
            this.tableColumns1 = []
            this.tableColumns = [
                {
                    label: '纳税人名称',
                    prop: 'nsrmc',
                    align: 'center',
                    width: 200,
                    render: 'true'
                },
                {
                    label: '纳税人识别号',
                    prop: 'nsrsbh',
                    align: 'center',
                    width: 200
                },

                {
                    label: '行业门类',
                    prop: 'hymlmc',
                    align: 'center',
                    width: 200
                },
                {
                    label: '行业大类',
                    prop: 'hydlmc',
                    align: 'center',
                    minWidth: 180
                },
                {
                    label: '行业中类',
                    prop: 'hyzlmc',
                    align: 'center',
                    width: 200
                },
                {
                    label: '行业小类',
                    prop: 'hyxlmc',
                    align: 'center',
                    width: 200,

                },
            ]
            console.log(params)
            this.queryObj.nsrmc = params.nsrmc || ''
            this.queryObj.nsrsbh = params.nsrsbh || ''

            this.queryObj.hyml_dm = params.hyml_dm
            this.queryObj.hydl_dm = params.hydl_dm
            this.queryObj.hyzl_dm = params.hyzl_dm
            this.queryObj.hyxl_dm = params.hyxl_dm


            this.queryObj.zbx = params.zbx
            this.queryObj.ksnd = params.nd[0]
            this.queryObj.jsnd = params.nd[1]
            this.queryObj.tbzzlks = params.tbzzl[0]
            this.queryObj.tbzzljs = params.tbzzl[1]

            console.log(this.queryObj)

            let zbxArr = {
                label: params.zbx,
                prop: '',
                align: 'center',
                width: 200,
                children: []
            }
            for (let i = params.nd[0]; i <= params.nd[1]; i++) {
                zbxArr.children.push(
                    {
                        label: i + '',
                        prop: '',
                        align: 'center',
                        children: [
                            {
                                label: '本期',
                                prop: 'jlr' + i,
                                align: 'center',
                            },
                            {
                                label: '同比',
                                prop: 'tb' + i,
                                align: 'center',
                            }
                        ]

                    })
            }

            this.tableColumns.push(zbxArr)
            this.showTable = true
            // this.tableColumns.forEach(item => {
            //     this.tableColumns1.push(item)
            // })
            // this.$nextTick(() => {
            //     this.tableColumns1 = this.tableColumns

            //      console.log(this.tableColumns1)
            // })
            console.log(this.tableColumns1)


            this.getTableData();
        },
        checkParams(index, str) {
            let arrList = this.fieldsList[index].options
            for (let i = 0; i < arrList.length; i++) {
                if (arrList[i].value == str) {
                    return arrList[i].label
                }
            }
        },
        resetForm() {
            for (let key in this.queryObj) {
                if (key == 'pageNo') {
                    this.queryObj[key] = 1;
                } else if (key == 'pageSize') {
                    this.queryObj[key] = 20;
                } else {
                    this.queryObj[key] = '';
                }
            }
            // this.tableDatas = []
            // this.total = 0

        },
        getTableData() {

            

            if (this.queryObj.zbx == '') {
                this.$message.error('财务指标不能为空！')
                return false
            }
            if (this.queryObj.ksnd == '' && this.queryObj.jsnd == '') {
                this.$message.error('请选择年度范围！')
                return false
            }
            if (this.queryObj.tbzzlks == '' && this.queryObj.tbzzljs == '') {
                this.$message.error('同比增长率不能为空！')
                return false
            }

            this.loading = true
            let params = {
                nsrmc: this.queryObj.nsrmc,
                nsrsbh: this.queryObj.nsrsbh,
                hymldm: this.queryObj.hyml_dm,
                hydldmc: this.queryObj.hydl_dm,
                hyzldm: this.queryObj.hyzl_dm,
                hyxldm: this.queryObj.hyxl_dm,




                zbx: this.queryObj.zbx,
                ksnd: this.queryObj.ksnd,
                jsnd: this.queryObj.jsnd,
                tbzzlks: this.queryObj.tbzzlks,
                tbzzljs: this.queryObj.tbzzljs,

                pageNum: this.queryObj.pageNo,
                pageSize: this.queryObj.pageSize,

                // sfssgs: this.queryObj.sfssgs ? 'Y' : '',
                // jtxxk: this.queryObj.jtxxk ? 'Y' : '',
            }
            queryQycwzbfx(params).then(res => {
                this.loading = false
                if (res.code == 200) {
                    this.tableDatas = res.data.records
                    this.total = res.data.total
                }
            })
        },
        gethylx(index, tableName, where, orderBy) {
            hylx({
                "tableName": tableName,
                "where": where,
                "orderBy": orderBy
                // "tableName": "dm_gy_hy",
                // "where": " mlbz = 'Y'",
                // "orderBy": "hy_dm"
            }).then(res => {
                console.log(res)
                if (res.data.length > 0) {

                    if (index == 2) {
                        this.fieldsList[index].options = res.data.map(item => {
                            return { value: item.HY_DM, label: item.HYMC }
                        })
                    } else {
                        this.fieldsList[index].options = res.data.map(item => {
                            return { value: item.HY_DM, label: item.HYMC }
                        })
                    }
                }
            })

        },





        changepageNo(currPage) {
            this.queryObj.pageNo = currPage;
            this.getTableData();
        },
        changePageSize(pageSize) {
            this.queryObj.pageSize = pageSize;
            this.getTableData();
        },



        exportDataHandle() {

            if (this.queryObj.zbx == '') {
                this.$message.error('财务指标不能为空！')
                return false
            }
            if (this.queryObj.ksnd == '' && this.queryObj.jsnd == '') {
                this.$message.error('请选择年度范围！')
                return false
            }

            if (this.queryObj.tbzzlks == '' && this.queryObj.tbzzljs == '') {
                this.$message.error('同比增长率不能为空！')
                return false
            }

            this.loading = true
            let params = {
                nsrmc: this.queryObj.nsrmc,
                nsrsbh: this.queryObj.nsrsbh,
                hymldm: this.queryObj.hyml_dm,
                hydldmc: this.queryObj.hydl_dm,
                hyzldm: this.queryObj.hyzl_dm,
                hyxldm: this.queryObj.hyxl_dm,
                zbx: this.queryObj.zbx,
                ksnd: this.queryObj.ksnd,
                jsnd: this.queryObj.jsnd,
                tbzzlks: this.queryObj.tbzzlks,
                tbzzljs: this.queryObj.tbzzljs,
                // pageNum: this.queryObj.pageNo,
                // pageSize: this.queryObj.pageSize,

            }

            exportData(params).then(res => {
                const elink = document.createElement("a");
                elink.download = this.queryObj.zbx+'.xlsx';
                elink.style.display = "none";
                elink.href = URL.createObjectURL(res);
                document.body.appendChild(elink);
                elink.click();
                URL.revokeObjectURL(elink.href); // 释放URL 对象
                document.body.removeChild(elink);
            })

        },


        currIndex(index) {
            return (this.queryObj.pageNo - 1) * this.queryObj.pageSize + index + 1;
        },

        go(param) {
            this.$router.push({ name: 'qycwbbfxmx', params: { nsrmc: param.nsrmc, nsrsbh: param.nsrsbh, ksnd: this.queryObj.ksnd, jsnd: this.queryObj.jsnd } });
        }
    }
}
</script>

<style lang="scss" scoped>
.dashboard-container {
    width: 100%;
    min-height: 100%;
    background-color: #fff;
    padding: 8px;
    .btn {
        padding: 0 0 8px 0;
    }
}
// .container {
//     height: 100%;
//     width: 100%;
//     background-color: #fff;
//     .searchMy {
//         padding: 8px;
//         .searchMy-form {
//             height: 28px;
//         }
//     }
// }

::v-deep .underline-text {
    text-decoration: underline;
    cursor: pointer;
    overflow: hidden;
    color: #409eff;
}
</style>
